﻿<UserControl
    x:Class="ParentingTrackerApp.Views.TrackingView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ParentingTrackerApp.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:converters="using:ParentingTrackerApp.Converters"
    mc:Ignorable="d"
    DataContextChanged="DataContextOnChanged"
    d:DesignHeight="300"
    d:DesignWidth="400">
    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="../Resources/Base.xaml"/>
                <ResourceDictionary>
                    <converters:EventTemplateSelector x:Key="EventTemplateSelector"
                                      RunningEventDataTemplate="{StaticResource RunningEventDataTemplate}"
                                      LoggedEventDataTemplate="{StaticResource LoggedEventDataTemplate}"/>
                    <DataTemplate x:Key="RunningEventDataTemplate">
                        <Grid>
                            <Border Background="{Binding Color, Converter={StaticResource ColorToBrushConverter}}">
                                <RichTextBlock IsTextSelectionEnabled="False"
                                               Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">
                                    <Paragraph>
                                        <Bold>
                                            <Underline>
                                                <Run Text="{Binding EventTypeName}"></Run>
                                            </Underline>
                                            <Run Text="{Binding RunningTime}"></Run>
                                        </Bold>
                                    </Paragraph>
                                    <Paragraph>
                                        <Italic>
                                            <Run Text="{Binding Notes}"></Run>
                                        </Italic>
                                    </Paragraph>
                                </RichTextBlock>
                            </Border>
                        </Grid>
                    </DataTemplate>
                    <DataTemplate x:Key="LoggedEventDataTemplate">
                        <Grid DataContextChanged="GridDataContextOnChanged">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Grid Grid.Column="0">
                                <Border Background="{Binding Color, Converter={StaticResource ColorToBrushConverter}}">
                                    <RichTextBlock IsTextSelectionEnabled="False"
                                                   Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">
                                        <Paragraph>
                                            <Run Text="{Binding LocalisedTimeRange}"></Run>
                                            <Run Text="{Binding Duration}"></Run>
                                            <Underline>
                                                <Run Text="{Binding EventTypeName}"></Run>
                                            </Underline>
                                        </Paragraph>
                                        <Paragraph>
                                            <Italic>
                                                <Run Text="{Binding Notes}"></Run>
                                            </Italic>
                                        </Paragraph>
                                    </RichTextBlock>
                                </Border>
                            </Grid>
                            <StackPanel Grid.Column="1" Orientation="Horizontal">
                                <Button Name="RemoveButton" Content="&#xE106;" FontFamily="Segoe UI Symbol"
                                        Width="40" PointerEntered="RedHighlightButtonOnPointerEntered"
                                        PointerExited="RedHighlightButtonOnPointerExited"
                                        PointerCanceled="RedHighlightButtonOnPointerExited"
                                        PointerCaptureLost="RedHighlightButtonOnPointerExited"
                                        PointerReleased="RedHighlightButtonOnPointerExited"
                                        Click="RemoveLoggedOnClick" Visibility="{Binding IsEditing, Converter={StaticResource BoolToVisibilityConverter}}">
                                    <ToolTipService.ToolTip>
                                        <TextBlock Text="Remove the event"></TextBlock>
                                    </ToolTipService.ToolTip>
                                </Button>
                                <ToggleButton Name="EditButton" Content="&#xE104;" FontFamily="Segoe UI Symbol" 
                                              Width="40" IsChecked="{Binding IsEditing, Mode=TwoWay}">
                                    <ToolTipService.ToolTip>
                                        <TextBlock Text="Edit the event"></TextBlock>
                                    </ToolTipService.ToolTip>
                                </ToggleButton>
                            </StackPanel>
                        </Grid>
                    </DataTemplate>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    <Grid>
        <Grid.Resources>
            <CollectionViewSource x:Key="groupInfoEventList" Source="{Binding AllEventsGrouped}"
                                  IsSourceGrouped="true"/>
        </Grid.Resources>
        <Grid.RowDefinitions>
            <RowDefinition x:Name="EditorRow"/>
            <RowDefinition Height="40"/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Name="Editor" Grid.Row="0"
                    Visibility="{Binding IsEditing, Converter={StaticResource BoolToVisibilityConverter}}">
            <Grid DataContext="{Binding EventInEditing}" DataContextChanged="EditorOnDataContextChanged">
                <Grid Background="{Binding Color, Converter={StaticResource ColorToBrushConverter}}">
                    <Grid.Resources>
                        <Style TargetType="TextBlock">
                            <Setter Property="VerticalAlignment" Value="Center"></Setter>
                        </Style>
                    </Grid.Resources>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="35"/>
                        <RowDefinition Height="35"/>
                        <RowDefinition Height="70"/>
                    </Grid.RowDefinitions>
                    <Grid Grid.Row="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="30"/>
                        </Grid.ColumnDefinitions>
                        <StackPanel Grid.Column="0" Orientation="Horizontal">
                            <TextBlock Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">Event type</TextBlock>
                            <TextBlock Text="{Binding EventTypeName}" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                       Margin="10,0,0,0" Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}"></TextBlock>
                            <ComboBox Name="SillyBox" ItemsSource="{Binding EventTypes}" SelectedItem="{Binding EventType, Mode=TwoWay}"
                                      Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                      Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource BoolToVisibilityConverter}}">
                                <ComboBox.ItemTemplate>
                                    <DataTemplate>
                                        <Border Background="{Binding Color, Converter={StaticResource ColorToBrushConverter}}">
                                            <TextBlock Text="{Binding Name, Mode=OneWay}" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"></TextBlock>
                                        </Border>
                                    </DataTemplate>
                                </ComboBox.ItemTemplate>
                            </ComboBox>
                        </StackPanel>
                        <Button Grid.Column="1" Click="CloseEditorOnClick" Content="X" 
                                Background="Transparent" BorderBrush="Transparent"
                                Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">
                            <ToolTipService.ToolTip>
                                <TextBlock Text="Close the editor"></TextBlock>
                            </ToolTipService.ToolTip>
                        </Button>
                    </Grid>
                    <Grid Grid.Row="1">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="40"></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">Notes</TextBlock>
                        <TextBlock Grid.Column="1" Margin="5,0,0,0" FontStyle="Italic" Text="{Binding Notes, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                                   Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                   Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}"></TextBlock>
                        <TextBox Grid.Column="1" Text="{Binding Notes, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                                 Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                 Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource BoolToVisibilityConverter}}"></TextBox>
                    </Grid>
                    <Grid Grid.Row="2">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="35"></RowDefinition>
                            <RowDefinition Height="35"></RowDefinition>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="40"></ColumnDefinition>
                            <ColumnDefinition></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <TextBlock Text="Start" Grid.Row="0" Grid.Column="0" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"></TextBlock>
                        <StackPanel Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
                            <TextBlock Text="{Binding StartTime, Converter={StaticResource DateTimeToDateStringConverter}}"
                                       Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                       Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}"
                                       Margin="0,0,10,0">
                            </TextBlock>
                            <TextBlock Text="{Binding StartTime, Converter={StaticResource DateTimeToTimeStringConverter}}"
                                       Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                       Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}">
                            </TextBlock>
                            <Button Content="{Binding StartTime, Converter={StaticResource DateTimeToDateStringConverter}}"
                                    Click="DateTimeButtonOnClick" Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource BoolToVisibilityConverter}}"
                                    Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}">
                                <FlyoutBase.AttachedFlyout>
                                    <DatePickerFlyout Date="{Binding StartDate, Mode=TwoWay}">
                                    </DatePickerFlyout>
                                </FlyoutBase.AttachedFlyout>
                            </Button>
                            <Button Content="{Binding StartTime, Converter={StaticResource DateTimeToTimeStringConverter}}"
                                    Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                    Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource BoolToVisibilityConverter}}"
                                    Click="DateTimeButtonOnClick" >
                                <FlyoutBase.AttachedFlyout>
                                    <TimePickerFlyout Time="{Binding StartTimeOfDay, Mode=TwoWay}">
                                    </TimePickerFlyout>
                                </FlyoutBase.AttachedFlyout>
                            </Button>
                            <Button Margin="5,0,0,0" IsEnabled="{Binding IsCreatingOrRunningOrEditing}" Content="Auto"
                                    Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                    Visibility="{Binding IsCreatingOrRunningOrEditing, Converter={StaticResource BoolToVisibilityConverter}}"
                                    Click="StartAutoOnClick">
                                <ToolTipService.ToolTip>
                                    <TextBlock>Get the time from the last event if available</TextBlock>
                                </ToolTipService.ToolTip>
                            </Button>
                        </StackPanel>
                        <TextBlock Text="End" Grid.Row="1" Grid.Column="0" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"></TextBlock>
                        <StackPanel Orientation="Horizontal" Grid.Row="1" Grid.Column="1">
                            <TextBlock Text="{Binding EndTime, Converter={StaticResource DateTimeToDateStringConverter}}"
                                       Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                       Visibility="{Binding IsCreatingOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}"
                                       Margin="0,0,10,0">
                            </TextBlock>
                            <TextBlock Text="{Binding EndTime, Converter={StaticResource DateTimeToTimeStringConverter}}"
                                       Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                       Visibility="{Binding IsCreatingOrEditing, Converter={StaticResource InverseBoolToVisibilityConverter}}">
                            </TextBlock>
                            <Button Content="{Binding EndTime, Converter={StaticResource DateTimeToDateStringConverter}}"
                                    Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                    Click="DateTimeButtonOnClick" Visibility="{Binding IsCreatingOrEditing, Converter={StaticResource BoolToVisibilityConverter}}">
                                <FlyoutBase.AttachedFlyout>
                                    <DatePickerFlyout Date="{Binding EndDate, Mode=TwoWay}">
                                    </DatePickerFlyout>
                                </FlyoutBase.AttachedFlyout>
                            </Button>
                            <Button Content="{Binding EndTime, Converter={StaticResource DateTimeToTimeStringConverter}}"
                                    Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                    Click="DateTimeButtonOnClick" Visibility="{Binding IsCreatingOrEditing, Converter={StaticResource BoolToVisibilityConverter}}">
                                <FlyoutBase.AttachedFlyout>
                                    <TimePickerFlyout Time="{Binding EndTimeOfDay, Mode=TwoWay}">
                                    </TimePickerFlyout>
                                </FlyoutBase.AttachedFlyout>
                            </Button>
                            <Button Margin="5,0,0,0" Content="Auto" Foreground="{Binding Color, Converter={StaticResource FontInverseColorToBrushConverter}}"
                                    Click="EndAutoOnClick" Visibility="{Binding IsCreatingOrEditing, Converter={StaticResource BoolToVisibilityConverter}}">
                                <ToolTipService.ToolTip>
                                    <TextBlock>Get the time from the next event if available</TextBlock>
                                </ToolTipService.ToolTip>
                            </Button>
                        </StackPanel>
                    </Grid>
                </Grid>
            </Grid>
        </Grid>
        <StackPanel Grid.Row="1" Orientation="Horizontal">
            <StackPanel.Resources>
                <Style TargetType="Button">
                    <Setter Property="Width" Value="80"></Setter>
                </Style>
            </StackPanel.Resources>
            <Button Click="NewOnClick" Content="New">
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="Create a new event"/>
                </ToolTipService.ToolTip>
            </Button>
            <Button Visibility="{Binding IsCreating, Converter={StaticResource BoolToVisibilityConverter}}" Click="StartOnClick"
                    Content="Start">
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="Start running a new event. It will start with the present time if the start time field is left unchanged."/>
                </ToolTipService.ToolTip>
            </Button>
            <Button Visibility="{Binding CanStop, Converter={StaticResource BoolToVisibilityConverter}}" Click="StopOnClick"
                    Content="Stop">
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="Terminate and recorded the selected running event."/>
                </ToolTipService.ToolTip>
            </Button>
            <Button Visibility="{Binding CanStop, Converter={StaticResource BoolToVisibilityConverter}}" Click="CancelOnClick"
                    Name="Cancel" Content="Cancel" PointerEntered="RedHighlightButtonOnPointerEntered" 
                    PointerExited="RedHighlightButtonOnPointerExited"
                    PointerCanceled="RedHighlightButtonOnPointerExited"
                    PointerCaptureLost="RedHighlightButtonOnPointerExited"
                    PointerReleased="RedHighlightButtonOnPointerExited">
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="Cancel the selected running event."/>
                </ToolTipService.ToolTip>
            </Button>
            <Button Visibility="{Binding IsCreating, Converter={StaticResource BoolToVisibilityConverter}}" Click="LogOnClick"
                    Content="Just Add">
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="Add an event straight away with no duration."/>
                </ToolTipService.ToolTip>
            </Button>
            <!--<Button Content="Test" Click="TestOnClick">
            </Button>-->
            <Border Background="Yellow" Height="25" Margin="30,0,0,0" >
                <TextBlock Foreground="Red" VerticalAlignment="Center" Text="&#xE2C0;" FontFamily="Segoe UI Symbol" >
                <ToolTipService.ToolTip>
                    <TextBlock TextWrapping="Wrap" Text="If you don't specify start time and click start, it starts from the present time. However, you can always edit the details of an event later."/>
                </ToolTipService.ToolTip>
            </TextBlock>
            </Border>
        </StackPanel>
        <ListView Grid.Row="2" Name="EventsList"
                  ItemsSource="{Binding Source={StaticResource groupInfoEventList}}"
                  SelectedItem="{Binding SelectedEvent, Mode=TwoWay}"
                  SelectionChanged="EventsListOnSelectionChanged"
                  ScrollViewer.HorizontalScrollBarVisibility="Auto"
                  ScrollViewer.VerticalScrollBarVisibility="Auto"
                  ItemTemplateSelector="{StaticResource EventTemplateSelector}">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderContainerStyle>
                        <Style TargetType="ListViewHeaderItem">
                            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                        </Style>
                    </GroupStyle.HeaderContainerStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*"/>
                                    <ColumnDefinition Width="30"/>
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="{Binding Key}" TextWrapping="Wrap" 
                                           PointerReleased="GroupHeaderClicked"></TextBlock>
                            </Grid>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ListView.GroupStyle>
        </ListView>
        <ListView Name="GroupList" Grid.Row="0" Grid.RowSpan="3" Visibility="Collapsed" Background="White"
                  ItemsSource="{Binding GroupNames}" SelectionMode="Single"
                  ScrollViewer.VerticalScrollBarVisibility="Auto"
                  SelectionChanged="GroupListOnSelectionChanged">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition></ColumnDefinition>
                            <ColumnDefinition Width="40"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" Text="{Binding Name}" TextWrapping="Wrap" FontSize="20"></TextBlock>
                        <Button Grid.Column="1" Content="&#xE106;" FontFamily="Segoe UI Symbol"
                                Visibility="{Binding CanDelete, Converter={StaticResource ResourceKey=BoolToVisibilityConverter}}"
                                Click="DeleteGroupsButtonOnClick">
                            <ToolTipService.ToolTip>
                                <TextBlock TextWrapping="Wrap">Delete all events in this group and groups earlier than it</TextBlock>
                            </ToolTipService.ToolTip>
                        </Button>
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</UserControl>
